<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<form id="ff" method="post">
	<table class="stable" cellpadding="1" cellspacing="1" style="padding: 2px; width: 100%">
		<tr>
			<td width="15%" class="stdlabel">小图标式录入框</td>
			<td width="15%" class="stdinput">
				<input data-type="inputiconbox" name="name1" data-defs="iconClick:searcherTest,required:true"></input>
			</td>
			<td width="15%" class="stdlabel">文本录入框</td>
			<td width="15%" class="stdinput">
				<input data-type="inputbox" type="text" name="name2" data-defs="required:true,validType:'email'"></input>
			</td>
			<td width="15%" class="stdlabel">下拉列表(单选)</td>
			<td width="15%" class="stdinput">
				<select name="name3" data-type="combogrid"
					data-defs="required:true,
									panelWidth: 500,idField: 'itemid',textField: 'productname',multiple: false,fitColumns: true,
									method:'get',url: 'demo/testdata/grid_data1.json',tipPosition:'left',
									columns: [[
										{field:'itemid',title:'ID',width:80},
										{field:'productname',title:'产品名称',width:190},
										{field:'listprice',title:'成本',width:80,align:'right'},
										{field:'unitcost',title:'单价',width:80,align:'right'},
										{field:'attr1',title:'属性',width:200},
										{field:'status',title:'状态',width:60,align:'center'}
									]]
								">
				</select>
			</td>
		</tr>
		<tr>
			<td width="15%" class="stdlabel" title="文本录入框(自定义校验)">文本录入框</td>
			<td width="15%" class="stdinput">
				<input data-type="inputbox" type="text" name="name4"
					data-defs="required:true,validType:'length[0,5]',tipPosition:'left'"></input>
			</td>
			<td width="15%" class="stdlabel">下拉列表(多选)</td>
			<td width="15%" class="stdinput">
				<select name="name5" data-type="combogrid"
					data-defs="required:true,multiple:true,
									panelWidth: 500,idField: 'itemid',textField: 'productname',fitColumns: true,
									method:'get',url: 'demo/testdata/grid_data1.json',
									columns: [[
										{field:'ck',checkbox:true},
										{field:'itemid',title:'ID',width:80},
										{field:'productname',title:'产品名称',width:190},
										{field:'listprice',title:'成本',width:80,align:'right'},
										{field:'unitcost',title:'单价',width:80,align:'right'},
										{field:'attr1',title:'属性',width:200},
										{field:'status',title:'状态',width:60,align:'center'}

									]]
								">
				</select>
			</td>
			<td width="15%" class="stdlabel">整数</td>
			<td width="15%" class="stdinput">
				<input data-type="numberbox" type="text" name="name6" data-defs="required:true,tipPosition:'left'"></input>
			</td>
		</tr>
		<tr>
			<td width="15%" class="stdlabel">浮点数</td>
			<td width="15%" class="stdinput">
				<input data-type="numberbox" type="text" name="name7" data-defs="precision:2,required:true"></input>
			</td>
			<td width="15%" class="stdlabel">数字格式化</td>
			<td width="15%" class="stdinput">
				<input data-type="numberbox" value="1234567.89" name="name8"
					data-defs="precision:2,groupSeparator:',',decimalSeparator:'.',required:true"></input>
			</td>
			<td width="15%" class="stdlabel">时间选择</td>
			<td width="15%" class="stdinput">
				<input data-type="timespinner" type="text" name="name9"
					data-defs="min:'08:30',max:'18:00',required:true,tipPosition:'left'"></input>
			</td>
		</tr>
		<tr>
			<td width="15%" class="stdlabel">日期</td>
			<td width="15%" class="stdinput">
				<input data-type="datebox" type="text" name="name10" data-defs="panelWidth: 200,required:true" />
			</td>
			<td width="15%" class="stdlabel">下拉树(多选)</td>
			<td width="15%" class="stdinput">
				<select data-type="combotree" name="name11"
					data-defs="multiple:true,method:'get',url: 'demo/testdata/tree_data1.json',required:true">
				</select>
			</td>
			<td width="15%" class="stdlabel">下拉框(单选)</td>
			<td width="15%" class="stdinput">
				<input data-type="combobox" name="name12"
					data-defs="required:true,panelWidth: 300,
								method:'get',url: 'demo/testdata/combobox_data1.json',
								valueField:'id',textField:'text',
								multiple:false,
								formatter: formatItem,tipPosition:'left'
								" />
			</td>
		</tr>
		<tr>
			<td width="15%" class="stdlabel">日期(带时间)</td>
			<td width="15%" class="stdinput">
				<input data-type="datetimebox" name="name13" data-defs="panelWidth: 200,required:true,tipPosition:'left'" />
			</td>
			<td width="15%" class="stdlabel">下拉树(单选)</td>
			<td width="15%" class="stdinput">
				<select data-type="combotree" name="name14"
					data-defs="multiple:false,method:'get',url: 'demo/testdata/tree_data1.json',required:true">
				</select>
			</td>
			<td width="15%" class="stdlabel">下拉框(多选)</td>
			<td width="15%" class="stdinput">
				<input data-type="combobox" name="name15"
					data-defs="required:true,panelWidth: 300,
								method:'get',url: 'demo/testdata/combobox_data1.json',
								valueField:'id',textField:'text',
								multiple:true,
								formatter: formatItem,tipPosition:'left'
								" />
			</td>
		</tr>
		<tr>
			<td width="15%" class="stdlabel">数字选择</td>
			<td width="15%" class="stdinput">
				<input data-type="numberspinner" type="text" name="name16" data-defs="min:10,max:100,increment:10,required:true"></input>
			</td>
			<td width="15%" class="stdlabel">数字选择</td>
			<td width="15%" class="stdinput">
				<input data-type="numberspinner" type="text" name="name17" data-defs="min:10,max:100,increment:10,required:true"></input>
			</td>
			<td width="15%" class="stdlabel">数字选择</td>
			<td width="15%" class="stdinput">
				<input data-type="numberspinner" type="text" name="name18"
					data-defs="min:10,max:100,increment:10,required:true,tipPosition:'left'"></input>
			</td>
		</tr>
		<tr>
			<td width="15%" class="stdlabel">备注</td>
			<td colspan="5" width="85%" class="stdinput">
				<textarea data-type="inputbox" name="name19" height: 60px;"
						data-defs="required:true,tipPosition:'left'"></textarea>
			</td>
		</tr>
	</table>
</form>
<div style="margin: 10px 0; float: right;">
	<a href="javascript:void(0)" data-type="button" data-defs="iconCls:'icon-ok','width':80" onclick="setFormValues()">设置值</a>
	<a href="javascript:void(0)" data-type="button" data-defs="iconCls:'icon-ok','width':80" onclick="getFormValue()">获取值</a>
	<a href="javascript:void(0)" data-type="button" data-defs="iconCls:'icon-reload','width':80"
		onclick="clearFormValues()">清空</a>
	<a href="javascript:void(0)" data-type="button" data-defs="iconCls:'icon-save','width':80" onclick="submitForm()">表单提交</a>
	<a href="javascript:void(0)" data-type="button" data-defs="iconCls:'icon-ok','width':80" onclick="resetForm()">表单重置</a>
</div>
<div id="w" data-type="window" title="XXX信息查询"
	data-defs="minimizable:false,collapsible:false,modal:true,closed:true,iconCls:'icon-search'"
	style="width: 880px; height: 520px; padding: 1px;"></div>
<script type="text/javascript">
	function formatItem(row) {
	    var s = '<span style="font-weight:bold">' + row.text + '</span><br/>' + '<span>' + row.desc + '</span>';
	    return s;
    }
    function searcherTest(obj) {
	    //alert("输入值:" + obj);
	    $("#w").window("open");
	    $("#w").window("refresh", "弹出1.html");
    }

    function resetForm() {
	    $("#ff").form("reset");
    }
    function getFormValue() {
	    var formValues = $("#ff").form("getValues");
	    alert(JSON.stringify(formValues));
    }
    function clearFormValues() {
	    $("#ff").form("clear");
    }
    function setFormValues() {
	    $('#ff').form('load', 'static_resources/ui/jww/demo/testdata/form_data2.json');
    }
    function submitForm() {
	    if ($('#ff').form('validate')) {
		    $('#ff').form('submit');
	    }
    }
</script>
